<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
    <link rel="Bookmark" href="/favicon.ico" >
    <link rel="Shortcut Icon" href="/favicon.ico" />
    <title>Fengadmin-内容管理系统</title>
    <link rel="stylesheet" href="{{ asset('static/component/pear/css/pear.css') }}">
    <link rel="stylesheet" href="{{ asset('static/admin/css/other/login.css') }}">
</head>
<body background="/static/admin/images/background.svg" style="background-size: cover;">
<form class="layui-form" action="javascript:void(0);" lay-filter="login-form">
    <div class="layui-form-item">
        <img class="logo" src="/static/admin/images/logo.png" />
        <div class="title">内容管理系统</div>
    </div>
    <div class="layui-form-item">
        <input placeholder="账 户 : " type="text" name="account" lay-verify="required|account" class="layui-input" />
    </div>
    <div class="layui-form-item">
        <input placeholder="密 码 : " type="password" name="password" lay-verify="required|password" class="layui-input" autocomplete="off" />
    </div>
    @if(session('account_login_error') > 0)
    <div class="layui-form-item">
        <input placeholder="验 证 : " type="text" name="vcode"  lay-verify="required|number" autocomplete="off" class="code layui-input layui-input-inline" style="width: 120px" />
        <img src="{{ captcha_src() }}" id="verify-img" class="codeImage" />
    </div>
    @endif
    <div class="layui-form-item">
        @csrf
        <button type="submit" class="pear-btn pear-btn-success login" lay-submit lay-filter="login">登 入</button>
    </div>
</form>
<script src="{{ asset('static/component/layui/layui.js') }}"></script>
<script src="{{ asset('static/component/pear/pear.js') }}"></script>
<script>
    layui.use(['form', 'button', 'jquery'], function() {
        var form = layui.form;
        var button = layui.button;
        var $ = layui.jquery;

        @if(session('account_login_num') > 0)
        // 验证码点击刷新
        $("#verify-img").click(function () {
            $(this)[0].src ="{{ captcha_src() }}?"+Math.random()
        })
        @endif

        // 验证
        form.verify({
            account: function(value, item){
                if(!new RegExp("^[a-zA-Z0-9_]{4,16}$").test(value)){
                    return '账户由4到16位字母，数字，下划线组成！';
                }
                return false
            },
            password: function(value, item){
                if(!new RegExp("^.*(?=.{6,})(?=.*\\d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$").test(value)){
                    return '密码最少6位，包括至少1个大写字母，1个小写字母，1个数字，1个特殊字符！';
                }
                return false
            },
            @if(session('account_login_num') > 0)
            vcode: function(value, item){
                    if(!new RegExp("^\d+$").test(value)){
                        return '验证码必须是数字！';
                    }
                    return false
                },
            @endif
        })

        // 登 录 提 交
        form.on('submit(login)', function(data) {
            // 获取表单的值
            var dataForm = form.val("login-form")

            // AJAX提交
            $.ajax({
                url: "{{ route('login') }}",
                async: false,
                type: "POST",
                dataType: "JSON",
                data: dataForm,
                success: function(data){
                    // 动画
                    button.load({
                        elem: '.login',
                        time: 1500,
                        done: function() {
                            if (data.status === 1) {
                                layer.msg(data.message, {icon:1, time: 1500}, function () {
                                    if (parent instanceof Object) {
                                        parent.location.href = "{{ route('index') }}";
                                    }else{
                                        location.href = "{{ route('index') }}";
                                    }
                                })
                            }else{
                                layer.msg(data.message, {icon:2, time: 1500}, function () {
                                    location.reload();
                                })
                            }
                        }
                    })
                }
            })
            return false;
        });
    })
</script>
</body>
</html>
